import { Button } from 'antd';
import { action, observable, observe } from "mobx";
import * as React from 'react';
import DialogStore from ".";
import { WeaLocaleProvider } from "ecCom";
import { get } from 'http';
const getLabel = WeaLocaleProvider.getLabel;


export default class AddSelectOptionsStore extends DialogStore {
    columns = [{
        com: [
            { type: 'input', key: 'selectName' }
        ],
        dataIndex: 'selectName',
        title: getLabel('502867', '可选项文字'),
        width: '70%',
    }, {
        com: [
            { type: 'select', key: 'childValue', multiple: 'true', options: this.selectValue || '' }
        ],
        dataIndex: 'unuse',
        title: '子字段选项',
        width: '20%',
    }
        // , {
        //     com: [
        //         { type: 'radio', key: 'default' }
        //     ],
        //     dataIndex: 'default',
        //     title: getLabel('502868','默认'),
        //     width: '20%',
        //     key:'default',
        //     checkType: 'radio',
        // }, {
        //     com: [
        //         { type: 'checkbox', key: 'unuse' }
        //     ],
        //     dataIndex: 'unuse',
        //     title:getLabel('502869','封存'),
        //     width: '20%',
        // }
    ];

    @observable datas = [];
    constructor(props) {
        super();
        this.excelDesignStore = props;
        this.style = { width: 600, height: 300 };
        this.title = getLabel('502870', '选项维护');
        this.buttons = [<Button key="cancel" type="primary" onClick={this.hide}>{getLabel(31129, '取消')}</Button>];
    }

    @action
    getSelectValues = () => {
        if (this.istable === 1) {
            this.selectValue = ((this.excelDesignStore.detailSelectCellTypeValueMap || {})[this.bindingPath] || {})[this.relatedChild];
        } else {
            this.selectValue = ((this.excelDesignStore.mainSelectCellTypeValueMap || {})[this.bindingPath] || {})[this.relatedChild];
        }

    }

    @action
    initOptions = (datas, relatedChild, bindingPath, fieldName, istable) => {
        this.datas = datas;
        this.relatedChild = relatedChild;
        this.bindingPath = bindingPath;
        this.istable = istable;
        if (istable === 1) {

            this.relatedChildGroup = (this.excelDesignStore.detailSelectCellTypesMap[bindingPath] || []).filter( r => r.key != fieldName);
        } else {
            this.relatedChildGroup = (this.excelDesignStore.mainSelectCellTypesMap[bindingPath] || []).filter( r => r.key != fieldName);
        }
        if(this.relatedChildGroup && this.relatedChildGroup.length > 0) {
            console.log(this.relatedChildGroup)
            this.relatedChildGroup.splice(0, 0,{})
        }
        this.selectValue = [];
        if (relatedChild ) {
            const match = this.relatedChildGroup.filter(r => r.key == relatedChild);
            if(match.length > 0) {

                this.getSelectValues();
            } else {
                this.childChange('');
            }
        } else {
            this.childChange('');
        }
    }
    @action
    onChange = (datas) => {
        this.datas = datas.map((d, index) => ({
            //default: "",
            selectValue: index,
            //unuse: "",
            ...d
        }));
    }


    // 子字段变化
    @action
    childChange = (relatedChild) => {
        this.relatedChild = relatedChild;
        // 清空子字段的可选值
        this.datas = this.datas.map((d, index) => ({
            //default: "",
            selectValue: index,
            //unuse: "",
            ...d,
            childValue: ''
        }));
        this.getSelectValues();
    }
}